@charset 'utf-8';

$bluefont:#0dafd2;
$grayfont:#7d7c7c;
$redfont:#f05447;
$greenfont:#26b26a;
$graylinecolor:#f0f0f0;

$bluecolor:#0dafd2;
$graycolor:#bcbcbc;
$weakcolor:#f0f0f0;
$blackcolor:#4d4c4c;


.communicate{
    width: 585px;
    height: 560px;

.top{
        width: 540px;
        height: 71px;
        margin: 0 auto;
        border-bottom: 1px solid $weakcolor;
        h2{
            font-size: 22px;
            color: $bluecolor;
            width: 182px;
            height: 32px;
            text-align: center;
            line-height: 71px; 
            font-weight: normal; 
            span{
                font-size: 31px;
                color: $blackcolor;
            }
        }
       .top_right{
            width: 225px;
            height: 71px;
            .top_right_top{
            width: 110px;
            height: 35px;
            padding-left: 130px;
            padding-top: 20px;
            font-size: 13px;
            line-height: 35px;
            a{
                color: #929191;
            }
        }
   
       }
    }
    
    
        .bottom{
        width: 585px;
//      height: 1182px;
        margin: 0 auto;
        li{
            width: 540px;
            height: 73px;
            border-bottom: 1px solid $graylinecolor;
            margin: 14px auto 0;
            .left_part{
                .imgwrap{
                    width: 53px;
                    height: 57px;
                    img{
                        width: 100%;
                        height: 100%;
                    }
                }
                
                .teamwork_desc{
                    margin-left: 10px;
                    h2{
                        color: $blackcolor;
                        font-size: 14px;
                    }
                    p{
                        margin-top: 5px;
                        font-size: 13px;
                        color: $blackcolor;
                    }
                }
            }
            
            .right_part{
                .time{
                    font-size: 13px;
                    color: $grayfont;
                    margin-top: 10px;
                }

            }
        }
    }

            .sending_time{
                width: 540px;
                height: 47px;
                text-align: center; 
                margin: 0 auto;
                line-height: 47px;
                color: $grayfont;
                font-size: 12px;
            }
            
            .dialog{
                width: 540px;
                height: 89px;
                background: url(../img/bubble_03.jpg) 0 0 no-repeat;
                background-size: 540px 89px;
                margin: 0 auto;
                position: relative;
                textarea{
                    width: 519px;
                    height: 71px;
                    border: 0;
                    resize: none;
                    position: absolute;
                    left: 5px;
                    top: 7px;
                }
            }
            
            .btn-wrap{
                width: 540px;
                height: 42px;
                margin: 0 auto;
                .sending_btn{
                    width: 82px;
                    height: 24px;
                    font-size: 14px;
                    color: white;
                    line-height: 24px;
                    float: right;
                    background: $bluecolor;
                    text-align: center;
                    border-radius: 2px 2px;
                    margin-right: 11px;
                    margin-top: 9px;
                    a{
                        color: white;
                    }
                }
            }
            
            .foot{
                 width: 540px;
                 height: 43px;
                 margin: 0 auto;
                 border-top: 1px solid $weakcolor  ;
                div{
                    width: 93px;
                    height: 43px;
                    float: right;
                    line-height: 43px;
                    span{
                        font-size: 12px;
                        a{
                            color: $grayfont;
                        }
                    }
                    span:last-child{
                        margin-left: 10px;
                        display: inline-block;
                        
                    }
                }
            }
               

}